<!--
* description: 值列表查询组件（多选，单选）,支持搜索
* author: liyanm
* createdDate: 2019-07-27
 *   2019-08-05 加入文字溢出效果 liyanm
*  2019-08-09 修改文字溢出效果-封装/校验效果 liyanm
*  2019-10-19 增加sendCode方法 dxuem
-->
<template>
  <el-col :span="span">
    <div class="comwidth">
      <lableName
        :validrule="validrule"
        :curLabelName="curLabelName"
        :isShowLabel="isShowLabel"
        :isRequire="isRequire"
      ></lableName>

      <el-select
        :placeholder="placeholder"
        :multiple="isMul"
        collapse-tags
        :filterable="filterable"
        v-model="modelCode"
        @clear="clearCodeSelect"
        :clearable="clearable"
        @change="sendCode1"
        :disabled="disabled"
        :readonly="readonly"
        size="small"
      >
        <el-option
          v-for="item in optionDatas"
          :key="item[optionFields.length > 1 ? optionFields[0] : defOptionFields[0]]"
          :label="item[optionFields.length > 1 ? optionFields[1] : defOptionFields[1]]"
          :value="item[optionFields.length > 1 ? optionFields[0] : defOptionFields[0]]"
        >{{item[optionFields.length > 1 ? optionFields[1] : defOptionFields[1]]}}</el-option>
      </el-select>
      <validateFormate :curLabelName="curLabelName" :validrule="validrule"></validateFormate>
    </div>
  </el-col>
</template>
<script>
import { crmApis } from "@/api/apiList/crm";
import { dropdownMixins } from "@/components/mixins/dropdownMixins";
// import lableName from "@/components/lableName";
// import validateFormate from "@/components/validateFormate";
import { nextTick } from "q";
export default {
  name: "lookupValue",
  // 组件混入对象：{props[span,isShowLabel,code,isMul,labelName] data[modelCode,optionDatas,listQuery] methods[queryTable,sendCode]}
  mixins: [dropdownMixins],
  components: {
    lableName: () => import("@/components/lableName"), //标题溢出样式组件
    validateFormate: () => import("@/components/validateFormate") //校验提示样式组件
  },
  props: {
    // 值列表类型编码
    lookuptype: { type: String, default: "_is_null_code_" },
    // 意向级别参数
    attribute: { type: String, default: undefined },
    remark: { type: String, default: undefined },
    // 获取组件中的名称，如：textField="carBrandCode"
    codeField: { type: String, default: "lookupValueCode" },
    // 获取组件中的名称，如：textField="carBrandName"
    textField: { type: String, default: "lookupValueName" },
    // 是否清空占位符
    showPlaceholder: { type: String, default: null }
  },

  data() {
    return {
      placeholder:
        this.showPlaceholder === null
          ? this.$t("sys.tips.esTip0")
          : this.showPlaceholder,
      // 默认绑定数据对象字段

      defOptionFields: ["lookupValueCode", "lookupValueName"],
      // API配置对象
      apiConfig: crmApis.mdsLookupValueQueryByPage,
      // 表格中台返回网格的字段
      apiQueryRow: [
        "oemCode",
        "groupCode",
        "lookupTypeCode",
        "lookupValueCode",
        "lookupValueName"
      ],
      // 下拉查询条件
      listQuery: {
        isEnable: "",
        lookupTypeCode: this.lookuptype,
        attribute1:this.attribute,
        remark:this.remark
      }
      //   curLabelName: this.label
    };
  },
  methods: {
    sendCode1(value) {
      let val = this.modelCode;
      let text = this.codeField;
      this.$emit("changeCode", val, text);
      this.$emit("sendChangeCode", val, text);
      this.$emit("getCode",val,text);
      let that = this;
      let option = that.optionDatas;
      let j = value;
      for (var i = 0; i < option.length; i++) {
        if (option[i].lookupValueCode == j) {
          let name = option[i].lookupValueName;
          this.$emit(
            "changeDropValue",
            j,
            name,
            that.codeField,
            that.textField
          );
          // this.$emit("sendChangeCode", val, text, name, that.textField);
          var parent = this.$utils.getHasFormFieldParentComponent(this);
          if (parent.formField[this.textField]) {
            parent.formField[this.textField] = name;
          }
        }
      }
      this.sendCode();
    },
    clearCodeSelect(){
       this.sendCode1()
    }
  },
  mounted() {}
};
</script>
